<script setup lang="jsx">
  import {watch,inject,ref,reactive} from 'vue'
  import { Message } from '@arco-design/web-vue'
  import uploadConfig from '@/config/upload'
  import tool from '@/utils/tool'
  import commonApi from '@/api/common'
  import Attachment from '@/api/logistics/attachmentPod'
  const crudRef = ref()
  const record = inject('record')
  const fileData = inject('fileData')
  watch(record,(newVal,oldVal)=>{
    if(newVal.id != undefined){
      console.log('刷新附件列表--'+record.value.id)
      crudRef.value.requestData()
    }
  })
  let options = reactive({
      id: 'customer_fee',
      pk: 'id',
      pageSize:100,
      autoRequest: record.value?.id > 0,
      showTools:false,
      expandSearch:false,
      // 右键菜单配置
      contextMenu: {
        // 是否开启右键菜单
        enabled: false,
      },
      isDbClickEdit:false,
      operationColumn: true,
      operationColumnWidth: 120,
      tablePagination:{style:{display:"none"}},
      api: Attachment.getList,
      beforeRequest:(param)=>{
        param.about_id = record.value.id
        return param;
      },
      beforeAdd:(param)=>{
        param.about_id = record.value.id
        return param;
      },
      add: {
        show: false,
        api: Attachment.save,
        auth: ['logistics:attachmentPod:save'],
      },
      edit: {
        show: true,
        api: Attachment.update,
        auth: ['logistics:attachmentPod:update']
      },
      delete: {
        show: true,
        batch: false,
        api: Attachment.deletes,
        auth: ['logistics:attachmentPod:delete']
      },
    })

    const getStoreMode = (mode) => {
    return uploadConfig.storageMode[mode.toString()]
  }

const download = async (record) => {
    let url = ''
    let storeMode = getStoreMode(record.storage_mode)

    if (storeMode !== 'LOCAL') {
      Message.info('处理中...')
      const domain = uploadConfig.storage[storeMode]
      url = domain + record.url
    } else {
      //文件上传在本地则请求后端下载
      Message.info('请求服务器下载文件中...')
      url = 'system/downloadById?id=' + record.id
    }

    const response = await commonApi.download(url, 'get')
    if (response) {
      tool.download(response, (storeMode !== 'LOCAL') ? record.origin_name : '')
      Message.success('请求成功，文件开始下载')  
    } else {
      Message.error('文件下载失败')  
    }
  }
const columns = ref([
  {
    title: "出库单",
    dataIndex: "send_nos",
    formType: "input",
  },
  {
    title: "运单",
    dataIndex: "shipment_nos",
    addDefaultValue:record.value.shipment_no,
    formType: "textarea",
    hide: true,
  },
  {
    title: '文件', 
    dataIndex: 'file',
    type: "file",
    // editDisplay: false,
    formType: "upload",
    hide:true,
    commonRules: {
      required: true,
      message: "请上传文件"
    }
  },
  {title: '', dataIndex: 'about_id',
    addDefaultValue:record.value.id,addDisplay: false,editDisplay: false,
    hide:true,
  },
  {title: '文件名', dataIndex: 'origin_name',addDisplay: false,editDisplay: false,},
  {title: '上传人',formType: "select", dataIndex: 'created_by',addDisplay: false,editDisplay: false,
    dict: {
        url: 'system/user/list',
        props: {label: 'nickname', value: 'id'} ,
        params: {select: 'id,nickname'},
      translation: true,
    },
  },
  {
    title: "备注",
    dataIndex: "remark",
    formType: "input",
  },
  {title: '上传时间', dataIndex: 'created_at',addDisplay: false,editDisplay: false,},
]);
</script>

<template>
  <a-grid-item :span="fileData.span">
    <a-collapse :default-active-key="['1']" class="g-collapse-no-p">
      <a-collapse-item header="POD" key="1">
        <template #extra>
          <a-button-group>
            <a-button type="primary" size="mini" @click.stop="crudRef.addAction()" v-auth="['logistics:attachmentPod:save']">上传</a-button>
          </a-button-group>
        </template>
          <ma-crud :options="options" :columns="columns" ref="crudRef" class="file-list">
            <template #operationBeforeExtend="{ record }">
              <a-link @click="download(record)"><icon-download /> 下载</a-link>
            </template>
          </ma-crud>
      </a-collapse-item>
    </a-collapse>
  </a-grid-item>
</template>
<style>
.file-list ._crud-header,.file-list .mb-2,.file-list .operation-tools,.file-list .mb-1{
  display:none;
}

</style>